.border-container{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
  .border-card{
    height: 200px;
    border-radius: 8px;
    background: rgba(0,0,0,.1);
    position: relative;
    overflow: hidden;
    &::before{
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      background: radial-gradient(closest-side circle,rgba(0,0,0,.6) 0%,transparent 100%);
      left: var(--x,-1000px);
      top: var(--y,-1000px);
      border-radius: inherit;
      z-index: 2;
      transform: translate(-50%,-50%);
    }
    .border-inner{
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      color: #fff;
      padding: 10px;
      inset: 2px;
      background: rgba(185, 214, 223, 1);
      border-radius: inherit;
      z-index: 3;
    }
  }
}
